/**
 * 由 WangYu 创建
 * 日期 2017/9/5
 */
import React, {Component} from 'react';
import {
    StyleSheet,
    Text,
    View,
    Image,
    ToastAndroid,
} from 'react-native';
import {defaultStatusBarColor} from "../../config/Config";
import MineItemView from "../mycomponent/MineItemView";
import MiddleModle from "../../data/MiddleView.json";
export default class MinePage extends Component {

    constructor(props) {
        super(props);
    }

    render() {
        return (
            <View style={styles.container}>
                {/*头像*/}
                <View style={styles.titleStyle}>
                    <Image source={{uri: 'shfw'}} style={{height: 70, width: 70}}/>
                    <Text style={styles.name}>小马哥美团</Text>
                    <Image style={{height: 20, width: 20, marginTop: 2}} source={{uri: 'avatar_vip'}}/>
                    <Image style={{height: 16, width: 10, marginTop: 2, position: 'absolute', right: 10}}
                           source={{uri: 'jt'}}/>
                </View>
                {/*优惠券|评价|收藏*/}
                <View style={{
                    height: 60,
                    flexDirection: 'row',
                    backgroundColor: '#f3765a',
                    alignItems: 'center'
                }}>
                    <View style={{alignItems: 'center', flex: 1}}>
                        <Text style={styles.text1}>100</Text>
                        <Text style={styles.text1}>优惠券</Text>
                    </View>
                    <View style={{width: 1, height: 30, backgroundColor: 'white'}}/>
                    <View style={{alignItems: 'center', flex: 1}}>
                        <Text style={styles.text1}>12</Text>
                        <Text style={styles.text1}>评价</Text>
                    </View>
                    <View style={{width: 1, height: 30, backgroundColor: 'white'}}/>
                    <View style={{alignItems: 'center', flex: 1}}>
                        <Text style={styles.text1}>50</Text>
                        <Text style={styles.text1}>收藏</Text>
                    </View>
                </View>
                {/*我的订单*/}
                <MineItemView leftIcon='avatar_grassroot' title='我的订单' rightText="查看全部订单"/>
                <View style={styles.orderStyle}>
                    <View style={styles.orderItem}>
                        <Image style={styles.orderImage} source={{uri: 'order1'}} resizeMode={'contain'}/>
                        <Text style={styles.orderText}>待付款</Text>
                    </View>
                    <View style={styles.orderItem}>
                        <Image style={styles.orderImage} source={{uri: 'order2'}} resizeMode={'contain'}/>
                        <Text style={styles.orderText}>待使用</Text>
                    </View>
                    <View style={styles.orderItem}>
                        <Image style={styles.orderImage} source={{uri: 'order3'}} resizeMode={'contain'}/>
                        <Text style={styles.orderText}>待评价</Text>
                    </View>
                    <View style={styles.orderItem}>
                        <Image style={styles.orderImage} source={{uri: 'order4'}} resizeMode={'contain'}/>
                        <Text style={styles.orderText}>退款/售后</Text>
                    </View>
                </View>
                {/*小马哥钱包以下*/}
                <MineItemView leftIcon='pay' title='我的钱包' rightText="账户余额:￥100000"/>
                <MineItemView leftIcon='draft' title='抵用券' rightText="10"/>
                <View style={{height: 10, backgroundColor: 'transparent'}}/>
                <MineItemView leftIcon='card' title='积分商城' rightText=""/>
                <View style={{height: 10, backgroundColor: 'transparent'}}/>
                <MineItemView leftIcon='new_friend' title='今日推荐' rightText=""/>
                <View style={{height: 10, backgroundColor: 'transparent'}}/>
                <MineItemView leftIcon='like' title='我要合作' rightText="轻松开店,招财进宝"/>
            </View>
        );
    }

}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: "#e8e8e8"
    },
    titleStyle: {
        backgroundColor: defaultStatusBarColor,
        height: 80,
        flexDirection: 'row',
        alignItems: 'center',
        paddingRight: 10,
    },
    name: {
        fontSize: 18,
        color: 'white'
    },
    text1: {
        fontSize: 12,
        color: 'white'
    },
    orderStyle: {
        flexDirection: 'row',
        justifyContent: 'space-around',
        backgroundColor: 'white',
        height: 65,
        marginBottom: 10,
    },
    orderItem: {
        justifyContent: 'center',
        alignItems: 'center'
    },
    orderImage: {
        width: 35,
        height: 35,
    },
    orderText: {
        fontSize: 14,
        color: '#666666'
    }
});
